﻿<Page
    x:Class="WeatherView.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WeatherView"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    DataContext="{Binding MainPageViewModel, RelativeSource={RelativeSource Self}}">
    
    <Page.Resources>
        <local:ForecastStyleConverter x:Key="ForecastColor"></local:ForecastStyleConverter>

    </Page.Resources>

    <Grid x:Name="myGrid" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <Grid.ColumnDefinitions>
            <ColumnDefinition x:Name="CurrentConditionsWidth" Width="4*"></ColumnDefinition>
            <ColumnDefinition x:Name="ForecastWidth" Width="1*"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition x:Name="CurrentConditionsHeight" Height="0*"></RowDefinition>
            <RowDefinition/>
            <RowDefinition x:Name="ForecastHeight" Height="0*"></RowDefinition>
        </Grid.RowDefinitions>

        <Grid Grid.Column="0" Grid.Row="0" Grid.RowSpan="2">
        
            <Image Source="{Binding CurrentConditionsImage, Mode=OneWay}" Stretch="UniformToFill"/>
            <ProgressRing IsActive="{Binding ProgressVisible, Mode=OneWay}"/>
            <StackPanel Orientation="Vertical"  VerticalAlignment="Top">
                <Grid  VerticalAlignment="Top">
                    <TextBlock Text="{Binding CurrentConditionsDetails, Mode=OneWay}"  Foreground="Black" FontSize="20" TextAlignment="Left" Margin="44,78,0,0"/>
                    <TextBlock Text="{Binding CurrentConditionsDetails, Mode=OneWay}"  Foreground="White" FontSize="20" TextAlignment="Left" Margin="43,77,0,0"/>
                </Grid>
                <Grid  VerticalAlignment="Top">

                <TextBlock Text="{Binding CurrentConditionsTemperature, Mode=OneWay}"  Foreground="Black" FontSize="128" TextAlignment="Left" Margin="34,24,0,0" FontFamily="Cooper Black" FontWeight="Bold"/>
                    <TextBlock Text="{Binding CurrentConditionsTemperature, Mode=OneWay}"  Foreground="White" FontSize="128" TextAlignment="Left" Margin="33,23,0,0" FontFamily="Cooper Black" FontWeight="Bold"/>
            </Grid>
                
            </StackPanel>
        </Grid>


        <StackPanel x:Name="ForecastPanel" Orientation="Vertical" Grid.Column="1" Grid.Row="0" Grid.RowSpan="2" >
            <Grid x:Name="Forecast1Grid" Background="White"  Height="200" Margin="2">
                <Image Source="{Binding Forecast1Image, Mode=OneWay,UpdateSourceTrigger=PropertyChanged}" Stretch="UniformToFill" Margin="20"/>
                <Grid VerticalAlignment="Bottom" >
                    <Rectangle Height="30" Fill="{Binding TemperatureDelta1, Converter={StaticResource ForecastColor},UpdateSourceTrigger=PropertyChanged}"></Rectangle>
                    <TextBlock Text="{Binding Forecast1Text, Mode=OneWay,UpdateSourceTrigger=PropertyChanged}" Height="18" Foreground="White" FontSize="16" VerticalAlignment="Center" TextAlignment="Center"/>
                </Grid>
            </Grid>

            <Grid x:Name="Forecast2Grid" Background="White"  Height="200" Margin="2">
                <Image Source="{Binding Forecast2Image, Mode=OneWay}" Stretch="UniformToFill" Margin="20" />
                <Grid VerticalAlignment="Bottom">
                    <Rectangle Height="30" Fill="{Binding TemperatureDelta2, Converter={StaticResource ForecastColor},UpdateSourceTrigger=PropertyChanged}"></Rectangle>
                    <TextBlock Text="{Binding Forecast2Text, Mode=OneWay,UpdateSourceTrigger=PropertyChanged}" Height="18" Foreground="White" FontSize="16" VerticalAlignment="Center" TextAlignment="Center"/>
                </Grid>
            </Grid>

            <Grid x:Name="Forecast3Grid"  Background="White" Margin="2">
                <Image Source="Assets/wundergroundLogo_4c.jpg" Margin="12"/>
            </Grid>
           

        </StackPanel>

    </Grid>
</Page>
